/* 防止图片闪一下 */
image{will-change: transform}
/* scroll-view */
.scroll-row{ width: 100%;white-space: nowrap; }
.scroll-row-item{ display: inline-block; }

:root{
	--col:#5555ff;
	--light_c: #BDD7EE;
	--holder_color: #dadada;
}

.cc1{background-color: #da251c;}
.cf1{color: #da251c}
.cb22{background-color: #222222}
.cb66{background-color: #666666}
.cf22{color: #222222}
.cf66{color: #666666}

.limit3{overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient: vertical;}

.limit2{overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}

.limit1{overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;}

/* 初始化标签在所有浏览器中的margin、padding值 */
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button,img{padding: 0; margin: 0;}
    /* 短引用的内容可取值：''或"" */
    blockquote:before, blockquote:after,q:before, q:after{content:'';content:none} /* 重置嵌套引用*/
    /* 缩写，图片等无边框 */
    fieldset,img,abbr,acronym{border: 0 none;} /* 重置fieldset（表单分组）、图片的边框为0*/
    abbr,acronym{font-variant: normal;}
    legend{color:#000;}
    blockquote, q{quotes: none} /* 重置嵌套引用的引号类型 */
    /* 清除特殊标记的字体和字号 */
    address,caption,cite,code,dfn,em,strong,th,var{font-weight: normal; font-style: normal;} /* 重置样式标签的样式 */
    /* 上下标 */
    /* 统一上标和下标 */
    sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
    sup{top:-0.5em; }
    sub{bottom:-0.25em;}
    /* 设置表格的边框被合并为一个单一的边框, 指定分隔边框模型中单元格边界之间的距离为0*/
    /* 表格标题及内容居左显示 */
    caption{display:none;} /* 重置表格标题为隐藏 */
    caption,th{text-align: left;}
    /* 清除列表样式 */
    dl,ul,ol,menu,li{list-style:none} /* 重置类表前导符号为onne,menu在HTML5中有效 */
    input,button,textarea,select,optgroup,option{font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit;}/* 输入控件字体 */
    input,select,textarea,button{vertical-align:middle;outline:none;} /* 重置表单控件垂直居中*/
    textarea{resize:none}
    input[type="submit"]{cursor: pointer;}/* 鼠标样式 */
    button{border:0 none;background-color:transparent;cursor:pointer} /* 重置表单button按钮效果 */
    input::-moz-focus-inner{border: 0; padding: 0;}

    /* 标题元素样式清除, 让标题都自定义, 适应多个系统应用 */
    h1,h2,h3,h4,h5,h6{font-size: 100%;font-weight: normal;}
    /* 链接样式，颜色可酌情修改 */
    a:link {text-decoration: none!important;}/* 未访问的链接 */
    a:visited {text-decoration: none!important;}/* 已访问的链接 */
    a:hover {text-decoration: none!important;}/* 鼠标移动到链接上 */
    a:active {text-decoration: none!important;}/* 选定的链接 */
    del,ins,a{text-decoration: none!important;}
    a:hover,a:active,a:focus{ text-decoration: none!important;} /* 取消a标签点击后的虚线框 */
    a:active{star:expression(this.onFocus=this.blur());} /* 设置页面文字等在拖动鼠标选中情况下的背景色与文字颜色 */
    a{outline: none;transition: color 0.2s ease 0s;}/*CSS3链接秒数缓冲效果2秒*/

    .none {
        display: none !important;
    }
    a:link, a:visited, a:hover, a:active {
        color: inherit;
    }


.bor_red{border: 1px solid red;}
.bor_red2{border: 4px solid red;}
.bor_red3{border: 8px solid red;}
.bor_green{border: 1px solid green;}
.bor_green2{border: 4px solid green;}
.bor_green3{border: 8px solid green;}
.bor_black{border: 1px solid black;}
.bor_black2{border: 4px solid black;}
.bor_black3{border: 8px solid black;}
.bor_blue{border: 1px solid blue;}
.bor_blue2{border: 4px solid blue;}
.bor_blue3{border: 8px solid blue;}

.c_red{background-color: #800000   }
.c_red2{background-color: #B22222 }
.c_red3{background-color: #FF4500 }
.c_red4{background-color: #FF69B4  }
.c_yellow{background-color: #FFA500 }
.c_yellow2{background-color: #DAA520 }
.c_yellow3{background-color: #FFD700 }
.c_yellow4{background-color: #FFFF00 }
.c_blue{background-color: #0000CD }
.c_blue2{background-color: #4169E1 }
.c_blue3{background-color: #6495ED }
.c_blue4{background-color: #87CEEB  }
.c_green{background-color: #228B22 }
.c_green2{background-color: #32CD32 }
.c_green3{background-color: #66ff50}
.c_green4{background-color: #ADFF2F }
.c_pink{background-color: #8A2BE2 }
.c_pink2{background-color: #9370DB }
.c_pink3{background-color: #DA70D6 }
.c_pink4{background-color: #DDA0DD }
.c_gray{background-color: #808080 }
.c_gray2{background-color: #A9A9A9 }
.c_gray3{background-color: #D3D3D3 }
.c_gray4{background-color: #e9e9e9}
.c_black{background-color: black}
.c_white{background-color: white}
.c_cyan{background-color: #00e9e9}
.c_cyan2{background-color: #17fff9}
.c_cyan3{background-color: #8dfffd}
.c_cyan4{background-color: #d8fffd}
.c10{background-color:#2F0000}
.c11{background-color:#4D0000}
.c12{background-color:#750000}
.c13{background-color:#AE0000}
.c14{background-color:#CE0000}
.c15{background-color:#EA0000}
.c16{background-color:#FF0000}
.c17{background-color:#FF2D2D}
.c18{background-color:#FF5151}
.c19{background-color:#ff7575}
.c20{background-color:#28004D}
.c21{background-color:#3A006F}
.c22{background-color:#5B00AE}
.c23{background-color:#8600FF}
.c24{background-color:#921AFF}
.c25{background-color:#9F35FF}
.c26{background-color:#B15BFF}
.c27{background-color:#BE77FF}
.c28{background-color:#CA8EFF}
.c29{background-color:#d3a4ff}
.c30{background-color:#000079}
.c31{background-color:#000093}
.c32{background-color:#0000C6}
.c33{background-color:#2828FF}
.c34{background-color:#4A4AFF}
.c35{background-color:#6A6AFF}
.c36{background-color:#7D7DFF}
.c37{background-color:#9393FF}
.c38{background-color:#AAAAFF}
.c39{background-color:#B9B9FF}
.c40{background-color:#006000}
.c41{background-color:#007500}
.c42{background-color:#00A600}
.c43{background-color:#00DB00}
.c44{background-color:#00EC00}
.c45{background-color:#28FF28}
.c46{background-color:#53FF53}
.c47{background-color:#79FF79}
.c48{background-color:#93FF93}
.c49{background-color:#A6FFA6}
.c50{background-color:#642100}
.c51{background-color:#842B00}
.c52{background-color:#BB3D00}
.c53{background-color:#F75000}
.c54{background-color:#FF5809}
.c55{background-color:#FF8040}
.c56{background-color:#FF8F59}
.c57{background-color:#FF9D6F}
.c58{background-color:#FFAD86}
.c59{background-color:#FFBD9D}
.c60{background-color:#5B4B00}
.c61{background-color:#796400}
.c62{background-color:#AE8F00}
.c63{background-color:#D9B300}
.c64{background-color:#EAC100}
.c65{background-color:#FFD306}
.c66{background-color:#FFDC35}
.c67{background-color:#FFE153}
.c68{background-color:#FFE66F}
.c69{background-color:#FFED97}
.c70{background-color:#408080}
.c71{background-color:#272727}
.c72{background-color:#4F4F4F}
.c73{background-color:#6C6C6C}
.c74{background-color:#7B7B7B}
.c75{background-color:#8E8E8E}
.c76{background-color:#9D9D9D}
.c77{background-color:#ADADAD}
.c78{background-color:#BEBEBE}
.c79{background-color:#d0d0d0}
.c80{background-color:#003E3E}
.c81{background-color:#005757}
.c82{background-color:#009393}
.c83{background-color:#00CACA}
.c84{background-color:#00E3E3}
.c85{background-color:#00FFFF}
.c86{background-color:#4DFFFF}
.c87{background-color:#80FFFF}
.c88{background-color:#A6FFFF}
.c89{background-color:#BBFFFF}

.img100{width:100%;height:100%;}

.bor_box{box-sizing: border-box;}
.z_100{z-index: 100;}
.z_50{z-index: 50;}
.point{cursor:pointer}

/* 阴影 */
.shadow-1 {
    box-shadow: 4px 4px 8px rgba(114, 130, 138, 0.2)!important;
}
.shadow-2 {
    box-shadow: 8px 8px 16px rgba(114, 130, 138, 0.2)!important;
}
.shadow-3 {
    box-shadow: 12px 12px 48px rgba(114, 130, 138, 0.2)!important;
}
.shadow-4 {
    box-shadow: 0 0 40px rgba(114, 130, 138, 0.8)!important;
}
/* 定位 */
.position-absolute{ position: absolute; }
.position-fixed{ position: fixed; }
.position-relative{ position: relative; }
.left-0{ left: 0; }
.top-0{ top: 0; }
.bottom-0{ bottom: 0; }
.right-0{ right: 0; }
/* 宽高 */
.w-100{ width: 100%;}
.w-50{ width: 50%;}
.h-100{ height: 1250px;}
.h-50{ width: 625px; }
/* 字体 */
.font{ font-size: 25px; }
.font-20{ font-size: 22px; }
.font-30{ font-size: 30px; }
.font-35{font-size: 35px;}
.font-40{ font-size: 40px; }
.font-60{ font-size: 60px; }
.font-weight{ font-weight: bold!important; }
.font-weight-100{ font-weight: 100!important; }

.line-h0{ line-height: 0!important; }
.line-h{ line-height: 1!important; }
.line-h-sm{ line-height: 1.2!important; }
.line-h-md{ line-height: 1.5!important; }
.line-h-lg{ line-height: 2!important; }
.line-h-big{ line-height: 3!important; }

.line-through{ text-decoration: line-through; }

.text-center{ text-align: center; }
.text-left{ text-align: left; }
.text-right{ text-align: right; }

.row { box-sizing: border-box!important; display: flex!important; flex-direction: row; flex-wrap: wrap;}
[class*='col-'],[class*='span-'],[class*='span24-'] { min-height: 1px;box-sizing: border-box!important;}
/* 栅栏一 */
.col-1{ width: 62.5px; } 
.col-2{ width: 125px; } 
.col-3{ width: 187.5px; } 
.col-4{ width: 250px;} 
.col-5{ width: 312.5px; } 
.col-6{ width: 375px; }
.col-7{ width: 437.5px; }
.col-8{ width: 500px; }
.col-9{ width: 562.5px; }
.col-10{ width: 625px; }
.col-11{ width: 687.5px; }
.col-12{ width: 750px; }
/* 栅栏二 */
.span-1{ width: 5%; } 
.span-2{ width: 10%; } 
.span-3{ width: 15%; } 
.span-4{ width: 20%;} 
.span-5{ width: 25%; } 
.span-6{ width: 30%; }
.span-7{ width: 35%; }
.span-8{ width: 40%; }
.span-9{ width: 45%; }
.span-10{ width: 50%; }
.span-11{ width: 55%; }
.span-12{ width: 60%; }
.span-13{ width: 65%; }
.span-14{ width: 70%; }
.span-15{ width: 75%; }
.span-16{ width: 80%; }
.span-17{ width: 85%; }
.span-18{ width: 90%; }
.span-19{ width: 95%; }
.span-20{ width: 100%; }
/* 栅栏三 */
.span24-1{ width: 4.17%; } 
.span24-2{ width: 8.33%; } 
.span24-3{ width: 12.5%; } 
.span24-4{ width: 16.67%;} 
.span24-5{ width: 20.83%; } 
.span24-6{ width: 25%; }
.span24-7{ width: 29.17%; }
.span24-8{ width: 33.33%; }
.span24-9{ width: 37.5%; }
.span24-10{ width: 41.67%; }
.span24-11{ width: 45.83%; }
.span24-12{ width: 50%; }
.span24-13{ width: 54.17%; }
.span24-14{ width: 58.33%; }
.span24-15{ width: 62.5%; }
.span24-16{ width: 66.67%; }
.span24-17{ width: 70.83%; }
.span24-18{ width: 75%; }
.span24-19{ width: 79.17%; }
.span24-20{ width: 83.33%; }
.span24-21{ width: 87.5%; }
.span24-22{ width: 91.67%; }
.span24-23{ width: 95.83%; }
.span24-24{ width: 100%; }


/* flex布局 */
.d-flex{ display: flex; }
.d-block{ display: block; }
.d-inline-block{ display: inline-block; }


.ac{align-items: center;}
.as{align-items: flex-start;}
.ae{align-items: flex-end;}
.aa{align-items: space-around;}
.ab{align-items: space-between;}

.rsn{display: flex;flex-direction: row;justify-content:flex-start;flex-wrap: nowrap;}
.ren{display: flex;flex-direction: row;justify-content:flex-end;flex-wrap: nowrap;}
.rbn{display: flex;flex-direction: row;justify-content:space-between;flex-wrap: nowrap;}
.ran{display: flex;flex-direction: row;justify-content:space-around;flex-wrap: nowrap;}
.rcn{display: flex;flex-direction: row;justify-content:center;flex-wrap: nowrap;}

.csn{display: flex;flex-direction: column;justify-content:flex-start;flex-wrap: nowrap;}
.cen{display: flex;flex-direction: column;justify-content:flex-end;flex-wrap: nowrap;}
.cbn{display: flex;flex-direction: column;justify-content:space-between;flex-wrap: nowrap;}
.can{display: flex;flex-direction: column;justify-content:space-around;flex-wrap: nowrap;}
.ccn{display: flex;flex-direction: column;justify-content:center;flex-wrap: nowrap;}

.rsw{display: flex;flex-direction: row;justify-content:flex-start;flex-wrap: wrap;}
.rew{display: flex;flex-direction: row;justify-content:flex-end;flex-wrap: wrap;}
.rbw{display: flex;flex-direction: row;justify-content:space-between;flex-wrap: wrap;}
.raw{display: flex;flex-direction: row;justify-content:space-around;flex-wrap: wrap;}
.rcw{display: flex;flex-direction: row;justify-content:center;flex-wrap: wrap;}

.csw{display: flex;flex-direction: column;justify-content:flex-start;flex-wrap: wrap;}
.cew{display: flex;flex-direction: column;justify-content:flex-end;flex-wrap: wrap;}
.cbw{display: flex;flex-direction: column;justify-content:space-between;flex-wrap: wrap;}
.caw{display: flex;flex-direction: column;justify-content:space-around;flex-wrap: wrap;}
.ccw{display: flex;flex-direction: column;justify-content:center;flex-wrap: wrap;}

.cc{display: flex;flex-direction: column;justify-content:center;flex-wrap: nowrap;align-items: center}
.rc{display: flex;flex-direction: row;justify-content:center;flex-wrap: nowrap;align-items: center}

.tc{text-align: center}
.tl{text-align: left}
.tr{text-align: right}

.flex-grow1{flex-grow: 1;}
.flex-grow2{flex-grow: 2;}
.flex-grow3{flex-grow: 3;}
.flex-1{ flex: 1; }
.flex-column{ flex-direction: column; }
.flex-row{ flex-direction: row; }
.flex-wrap{ flex-wrap: wrap; }
.flex-nowrap{ flex-wrap: nowrap; }
.flex-shrink{flex-shrink: 0;}
.j-start{ justify-content: flex-start; }
.j-center{ justify-content: center; }
.j-end{ justify-content: flex-end; }
.j-around{ justify-content: space-around;}
.j-between{justify-content: space-between;}
.a-center{ align-items:center; }
.a-start{ align-items: flex-start; }
.a-end{ align-items:flex-end; }
.a-around{align-items: space-around;}
.a-between{align-items: space-between;}
.a-stretch{ align-items: stretch; }
.a-self-start{ align-self: flex-start; }
.a-self-auto{ align-self: auto; }
.a-self-end{ align-self: flex-end; }
.a-self-stretch{ align-self:stretch; }
.a-self-baseline{ align-self:baseline; }
/* Border */
.border{  border-width: 1px; border-style: solid; border-color: var(--borderColor);}
.border-top{ border-top-width: 1px; border-top-style: solid; border-top-color: var(--borderColor); }
.border-right{ border-right-width: 1px; border-right-style: solid; border-right-color: var(--borderColor);}
.border-bottom{ border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color:var(--borderColor);}
.border-left{ border-left-width: 1px;border-left-style: solid;border-left-color:var(--borderColor);}

.border-0{ border-width: 0; }
.border-top-0{ border-top-width: 0; }
.border-right-0{ border-right-width: 0; }
.border-bottom-0{ border-bottom-width: 0; }
.border-left-0{ border-left-width: 0; }

.border-primary{ border-color: var(--primary)!important }
.border-secondary{ border-color:var(--secondary)!important }
.border-success{ border-color: var(--success)!important }
.border-danger{ border-color: var(--danger)!important }
.border-warning{ border-color:var(--warning)!important }
.border-info{ border-color: var(--info)!important }
.border-light{ border-color: var(--light)!important }
.border-dark{ border-color: var(--dark)!important }
.border-white{ border-color: var(--white)!important }
.border-light-secondary{border-color: #F1F1F1!important;}

.radius5{ border-radius: 5px; }
.radius10{ border-radius: 10px; }
.radius20{ border-radius: 20px; }
.radius30{ border-radius: 30px; }
.radius50{ border-radius: 50px; }
.radius100{ border-radius:100%; }
.rounded-0{ border-radius:0; }

/* color */
.text-primary{ color:var(--primary)!important; }
.text-secondary{ color:var(--secondary)!important; }
.text-success{ color:var(--success)!important; }
.text-danger{ color: var(--danger)!important; }
.text-warning{ color:var(--warning)!important; }
.text-info{ color: var(--info)!important; }
.text-light{ color: var(--light)!important; }
.text-dark{ color: var(--dark)!important; }
.text-muted{ color: var(--muted)!important; }
.text-light-muted{ color: var(--lightmuted)!important; }
.text-white{ color: var(--white)!important; }

.bg-primary{ background-color:var(--primary)!important; }
.bg-secondary{ background-color:var(--secondary)!important; }
.bg-success{ background-color:var(--success)!important; }
.bg-danger{ background-color: var(--danger)!important; }
.bg-warning{ background-color:var(--warning)!important; }
.bg-info{ background-color: var(--info)!important; }
.bg-light{ background-color: var(--light)!important; }
.bg-dark{ background-color: var(--dark)!important; }
.bg-white{ background-color: var(--white)!important; }
.bg-light-secondary{background-color: #F1F1F1!important;}

/* Spacing */
.m-0 { margin-left: 0;margin-right: 0;margin-top: 0;margin-bottom: 0;}
.m { margin-left: 5px;margin-right: 5px;margin-top: 5px;margin-bottom: 5px;}
.m-1 { margin-left: 10px;margin-right: 10px;margin-top: 10px;margin-bottom: 10px;}
.m-2 { margin-left: 20px;margin-right: 20px;margin-top: 20px;margin-bottom: 20px;}
.m-3 { margin-left: 30px;margin-right: 30px;margin-top: 30px;margin-bottom: 30px;}
.m-4 { margin-left: 40px;margin-right: 40px;margin-top: 40px;margin-bottom: 40px;}
.m-5 { margin-left: 50px;margin-right: 50px;margin-top: 50px;margin-bottom: 50px;}

.mx-0 { margin-left: 0;margin-right: 0;}
.mx { margin-left: 5px;margin-right: 5px;}
.mx-1 { margin-left: 10px;margin-right: 10px;}
.mx-2 { margin-left: 20px;margin-right: 20px;}
.mx-3 { margin-left: 30px;margin-right: 30px;}
.mx-4 { margin-left: 40px;margin-right: 40px;}
.mx-5 { margin-left: 50px;margin-right: 50px;}

.my-0 { margin-top: 0;margin-bottom: 0;}
.my { margin-top: 5px;margin-bottom: 5px;}
.my-1 { margin-top: 10px;margin-bottom: 10px;}
.my-2 { margin-top: 20px;margin-bottom: 20px;}
.my-3 { margin-top: 30px;margin-bottom: 30px;}
.my-4 { margin-top: 40px;margin-bottom: 40px;}
.my-5 { margin-top: 50px;margin-bottom: 50px;}

.mt-0 { margin-top: 0;}
.mt { margin-top: 5px;}
.mt-auto { margin-top: auto;}
.mt-1 { margin-top: 10px;}
.mt-2 { margin-top: 20px;}
.mt-3 { margin-top: 30px;}
.mt-4 { margin-top: 40px;}
.mt-5 { margin-top: 50px;}

.mb-0 { margin-bottom: 0;}
.mb { margin-bottom: 5px;}
.mb-auto { margin-bottom: auto;}
.mb-1 { margin-bottom: 10px;}
.mb-2 { margin-bottom: 20px;}
.mb-3 { margin-bottom: 30px;}
.mb-4 { margin-bottom: 40px;}
.mb-5 { margin-bottom: 50px;}

.ml-0 { margin-left: 0;}
.ml { margin-left: 5px;}
.ml-auto { margin-left: auto;}
.ml-1 { margin-left: 10px;}
.ml-2 { margin-left: 20px;}
.ml-3 { margin-left: 30px;}
.ml-4 { margin-left: 40px;}
.ml-5 { margin-left: 50px;}

.mr-0 { margin-right: 0;}
.mr { margin-right: 5px;}
.mr-1 { margin-right: 10px;}
.mr-2 { margin-right: 20px;}
.mr-3 { margin-right: 30px;}
.mr-4 { margin-right: 40px;}
.mr-5 { margin-right: 50px;}

.p-0 {padding-left: 0;padding-right: 0;padding-top: 0;padding-bottom: 0;}
.p {padding-left: 5px;padding-right: 5px;padding-top: 5px;padding-bottom:5px;}
.p-1 {padding-left: 10px;padding-right: 10px;padding-top: 10px;padding-bottom: 10px;}
.p-2 {padding-left: 20px;padding-right: 20px;padding-top: 20px;padding-bottom: 20px;}
.p-3 {padding-left: 30px;padding-right: 30px;padding-top: 30px;padding-bottom: 30px;}
.p-4 {padding-left: 40px;padding-right: 40px;padding-top: 40px;padding-bottom: 40px;}
.p-5 {padding-left: 50px;padding-right: 50px;padding-top: 50px;padding-bottom: 50px;}

.px-0 { padding-left: 0;padding-right: 0;}
.px { padding-left: 5px;padding-right: 5px;}
.px-1 { padding-left: 10px;padding-right: 10px;}
.px-2 { padding-left: 20px;padding-right: 20px;}
.px-3 { padding-left: 30px;padding-right: 30px;}
.px-4 { padding-left: 40px;padding-right: 40px;}
.px-5 { padding-left: 50px;padding-right: 50px;}

.py-0 { padding-top: 0;padding-bottom: 0;}
.py { padding-top: 5px;padding-bottom: 5px;}
.py-1 { padding-top: 10px;padding-bottom: 10px;}
.py-2 { padding-top: 20px;padding-bottom: 20px;}
.py-3 { padding-top: 30px;padding-bottom: 30px;}
.py-4 { padding-top: 40px;padding-bottom: 40px;}
.py-5 { padding-top: 50px;padding-bottom: 50px;}

.pt-0 { padding-top: 0;}
.pt { padding-top: 5px;}
.pt-1 { padding-top: 10px;}
.pt-2 { padding-top: 20px;}
.pt-3 { padding-top: 30px;}
.pt-4 { padding-top: 40px;}
.pt-5 { padding-top: 50px;}

.pb-0 { padding-bottom: 0;}
.pb { padding-bottom: 5px;}
.pb-1 { padding-bottom: 10px;}
.pb-2 { padding-bottom: 20px;}
.pb-3 { padding-bottom: 30px;}
.pb-4 { padding-bottom: 40px;}
.pb-5 { padding-bottom: 50px;}

.pl-0 { padding-left: 0;}
.pl { padding-left: 5px;}
.pl-1 { padding-left: 10px;}
.pl-2 { padding-left: 20px;}
.pl-3 { padding-left: 30px;}
.pl-4 { padding-left: 40px;}
.pl-5 { padding-left: 50px;}

.pr-0 { padding-right: 0;}
.pr { padding-right: 5px;}
.pr-1 { padding-right: 10px;}
.pr-2 { padding-right: 20px;}
.pr-3 { padding-right: 30px;}
.pr-4 { padding-right: 40px;}
.pr-5 { padding-right: 50px;}
